<template>
    <div>
    </br>
        干部总结报告
    </br>
    </br>
        <el-form ref="form" :model="form" label-width="200px">
    <el-form-item label="姓名：">
      <el-input v-model="form.name":disabled="true" style="width:80%"></el-input>
    </el-form-item>
    <el-form-item label="邮箱：">
      <el-input v-model="form.email" :disabled="true" style="width:80%"></el-input>
    </el-form-item>
    <el-form-item label="题目：">
      <el-input v-model="form.reportName" :disabled="true"style="width:80%"></el-input>
    </el-form-item>
    <el-form-item label="内容：" >
      <el-input type="textarea" v-model="form.report":disabled="true" resize="none" :rows="10" maxlength="500" show-word-limit style="width:80%"></el-input>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" style="width:80%" @click="submitForm($route.params.id)">删除</el-button>
    </el-form-item>
  </el-form>

    </div>
    
</template>
  <script>
  import indexApi from '@/api/summary/index.js'
    export default {
      data() {
        return {
          form: {
            name: '',
            email: '',
            reportName: '',
            report: '',
          }
        }
      },

      created() { // 在渲染之前执行
        this.fetchDataById(this.$route.params.id)
    },
      methods: {
        


        submitForm(id){
          this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
          indexApi.removeById(id).then(response => {
            this.$router.push(`/summary/getinfo`)
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });          
        });
            
        },
        fetchDataById(id){
            console.log(id)
            indexApi.getbyid(id).then(response => {
                console.log(3)
                this.form=response.data
            })

        }
      }
    }
  </script>